<template>
	<view>
		<view>
			<u-input v-model="name" input-align="right" placeholder="请输入功能名称" />
		</view>
		<view v-for="item in dataSource" class="between center hang">
			<view class="flex-1">
				<view>{{item.name}}</view>
				<view style="text-indent: 2em;">
					<view v-for="child in item.child">
						{{child.name}}
					</view>
				</view>
			</view>
			<view class="center font-size-20">
				<view @click="openAdd(item)">
					<u-icon class="color-green" name="plus-circle-fill"></u-icon>
				</view>
				<view @click="openEdit(item)">
					<u-icon class="color-green" name="edit-pen-fill"></u-icon>
				</view>
				<view @click.stop="openDialogStatus(item)">
					<u-icon v-if="item.enable==1" class="color-green" name="lock-opened-fill"></u-icon>
					<u-icon v-else class="color-red" name="lock-fill"></u-icon>
				</view>
				<view @click.stop="openDialogDelete(item)">
					<u-icon name="trash-fill"></u-icon>
				</view>
			</view>
		</view>
		<!-- <u-modal :show="showDialog" title="温馨提示" :closeOnClickOverlay="true" :showCancelButton="true"
			@close="showDialog=false" @cancel="showDialog=false">
			<view class="slot-content">
				<rich-text :nodes="content"></rich-text>
			</view>
		</u-modal> -->
		<u-popup :show="showEdit" @close="close" :round="10" mode="bottom">
			<view>
				<DictionaryEdit :item="item"></DictionaryEdit>
			</view>
		</u-popup>
		<DialogVue :show="showDialog" :content="content" @confirm="confirm" @close="showDialog=false"></DialogVue>
	</view>
</template>

<script>
	import {
		dictionarySelect,
		dictionaryStatus,
	} from '../../api/dictionary';
	import DictionaryEdit from "./dictionaryEdit"
	import DialogVue from '../../components/Dialog.vue';
	export default {
		components: {
			DialogVue,
			DictionaryEdit
		},
		data() {
			return {
				dataSource: [],
				name: '',
				showDialog: false,
				content: '',
				showEdit: false,
				item: null,
			}
		},
		watch: {
			name(val) {
				this.name = val;
				this.search();
			},
		},
		mounted() {
			this.init();
		},
		created() {
			uni.$on('handleClose', this.close)
		},
		methods: {
			init() {
				dictionarySelect({
					name: this.name,
					status: 1,
					orderBy:"sort"
				}).then(res => {
					this.dataSource = res;
				})
			},
			search() {
				this.init()
			},
			openAdd(item) {
				this.showEdit = true
			},
			openEdit(item) {
				this.item = {
					...item
				}
				this.showEdit = true
			},
			openDialogStatus(item) {

			},
			openDialogDelete(item) {
				this.content = "确定要删除吗？"
				this.showDialog = true
				console.log(this.showDialog)
			},
			confirm() {
				this.showDialog = false
			},
			close() {
				this.showEdit = false
				this.item = null
				this.init()
			}
		}
	}
</script>

<style>
</style>